<?php
if ($intAuctionItemID){ 
    include (MODULE . "/action/qrySelectAuctionItem");
}
?>

<style type="text/css">
body{
	font-family: Arial,sans-serif;
	color: #000000;
	line-height: 1.166;
	margin: 0px;
	padding: 0px;
	background-color: #ffffff;
	font-size: 11px;
}

p{
	font-size: 12px;
	font-family: Arial,sans-serif;
}

td{
	font-size: 12px;
	font-family: Arial,sans-serif;

}
b{
	color: #993366;

}

li{
	list-style:square;
	font-size: 11px;
	font-family: Arial,sans-serif;
}

strong{
	color: #993366;

}
h1{
	color: #993366;
	font-family: Arial,sans-serif;
	font-size: 18px;

}

h2{
	color: #993366;
	line-height: 17px;
	font-family: Arial,sans-serif;
	font-size: 17px;
}

h3{
	color: #993366;
	font-family: Arial,sans-serif;
	font-size: 14px;
}

a{
	color: #993366;
	text-decoration: none;

}

a:link{
	color: #993366;
	text-decoration: none;

}

a:visited{
	color: #993366;
	text-decoration: none;

}

a:hover{
	color: #000000;
	background-color: #ffffff;
}

.disclaimer p{
	font-size: 11px;
	font-family: Arial,sans-serif;
} 

.gallerycontainer{
position: relative;
/*Add a height attribute and set to largest image's height to prevent overlaying*/
height:300px;
}

.thumbnail img{
border: 1px solid #993366;
margin: 0 0px 0px 0;
}

.thumbnail:hover{
background-color: transparent;
}

.thumbnail:hover img{
border: 1px solid black;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: -1000px;
border: 1px solid gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 1;
border: 1px solid #993366;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image*/
visibility: visible;
top: 0;
left: 340px; /*position where enlarged image should offset horizontally */
z-index: 50;
}
</style>	  

<script type="text/javascript">
     function toggle(id){
	 	var theDiv = document.getElementById(id);
		  if(theDiv) {	
			    if(theDiv.style.display == 'none'){ 
					theDiv.style.display = 'block';	
			    }else{
					theDiv.style.display = 'none'; 	
				}
		  }
		  
     }	
	 
	 function ToggleTab(id,show){
	  	var theDiv = document.getElementById(id);
	 		if(theDiv) {		
				theDiv.style.display = show;	
		  	}
	 }	   	
	 
	 function ToggleTabReturns(){ 
	 	 ToggleTab("tabReturns","block"); 
		 ToggleTab("tabAbout","none"); 
		 ToggleTab("tabShipping","none"); 
		 ToggleTab("tabPayment","none");
	 
	 }	  
	 
	 function ToggleTabPayment(){ 
	 	 ToggleTab("tabReturns","none"); 
		 ToggleTab("tabAbout","none"); 
		 ToggleTab("tabShipping","none"); 
		 ToggleTab("tabPayment","block");
	 
	 }
	 
	 function ToggleTabAbout(){ 
	 	 ToggleTab("tabReturns","none"); 
		 ToggleTab("tabAbout","block"); 
		 ToggleTab("tabShipping","none"); 
		 ToggleTab("tabPayment","none");
	 
	 } 
	 
	 function ToggleTabShipping(){ 
	 	 ToggleTab("tabReturns","none"); 
		 ToggleTab("tabAbout","none"); 
		 ToggleTab("tabShipping","block"); 
		 ToggleTab("tabPayment","none");
	 
	 }
	 
	 function ToggleOff(){	 
	 	toggle("tabReturns"); 
		toggle("tabAbout"); 
		toggle("tabPayment"); 
	 
	 } 
	 

	 
</script>
<table width='75%' align='center' border='0' bordercolor="#008000" cellpadding="8" bordercolorlight="#008000" bordercolordark="#008000">
	<tr>
		<td colspan='1'>

			<hr />
		</td>
	</tr>
	<tr valign="top">
		<td valign="top" align='left'>
		<h1><?php echo $myrow[ItemName] ?></h1>
			<?php $strImageLocation = "http://ebay.howtosellonline.co.uk/images/auction/"; ?>
			<div class="gallerycontainer">
				<a class="thumbnail" href="#thumb"><img src="<?php echo $strImageLocation."thumbz/".$myrow["UploadedPhoto1"] ?>" width="100px" height="100px" border="0" /><span><img src="<?php echo $strImageLocation.$myrow["UploadedPhoto1"] ?>" /></span></a>
				<?php if($myrow["UploadedPhoto2"]){ ?>
					<a class="thumbnail" href="#thumb"><img src="<?php echo $strImageLocation."thumbz/".$myrow["UploadedPhoto2"] ?>" width="100px" height="100px" border="0" /><span><img src="<?php echo $strImageLocation.$myrow["UploadedPhoto2"] ?>" /></span></a>
				<?php }?>  
				
				<?php if($myrow["UploadedPhoto3"]){ ?>
					<a class="thumbnail" href="#thumb"><img src="<?php echo $strImageLocation."thumbz/".$myrow["UploadedPhoto3"] ?>" width="100px" height="100px" border="0" /><span><img src="<?php echo $strImageLocation.$myrow["UploadedPhoto3"] ?>" /></span></a> 
				<?php }?> 
				<br />
				<?php if($myrow["UploadedPhoto4"]){ ?>
					<a class="thumbnail" href="#thumb"><img src="<?php echo $strImageLocation."thumbz/".$myrow["UploadedPhoto4"] ?>" width="100px" height="100px" border="0" /><span><img src="<?php echo $strImageLocation.$myrow["UploadedPhoto4"] ?>" /></span></a>
				<?php }?>
				
				<?php if($myrow["UploadedPhoto5"]){ ?>
					<a class="thumbnail" href="#thumb"><img src="<?php echo $strImageLocation."thumbz/".$myrow["UploadedPhoto5"] ?>" width="100px" height="100px" border="0" /><span><img src="<?php echo $strImageLocation.$myrow["UploadedPhoto5"] ?>" /></span></a>
				<?php }?>

				<?php if($myrow["UploadedPhoto6"]){ ?>
					<a class="thumbnail" href="#thumb"><img src="<?php echo $strImageLocation."thumbz/".$myrow["UploadedPhoto6"] ?>" width="100px" height="100px" border="0" /><span><img src="<?php echo $strImageLocation.$myrow["UploadedPhoto6"] ?>" /></span></a>
				<?php }?>
				<br />
				<?php if($myrow["UploadedPhoto7"]){ ?>
					<a class="thumbnail" href="#thumb"><img src="<?php echo $strImageLocation."thumbz/".$myrow["UploadedPhoto7"] ?>" width="100px" height="100px" border="0" /><span><img src="<?php echo $strImageLocation.$myrow["UploadedPhoto7"] ?>" /></span></a>
				<?php }?>

				<?php if($myrow["UploadedPhoto8"]){ ?>
					<a class="thumbnail" href="#thumb"><img src="<?php echo $strImageLocation."thumbz/".$myrow["UploadedPhoto8"] ?>" width="100px" height="100px" border="0" /><span><img src="<?php echo $strImageLocation.$myrow["UploadedPhoto8"] ?>" /></span></a>
				<?php }?>
				
				<?php if($myrow["UploadedPhoto9"]){ ?>
					<a class="thumbnail" href="#thumb"><img src="<?php echo $strImageLocation."thumbz/".$myrow["UploadedPhoto9"] ?>" width="100px" height="100px" border="0" /><span><img src="<?php echo $strImageLocation.$myrow["UploadedPhoto9"] ?>" /></span></a>
				<?php }?>
			</div>
		</td>
	</tr>     
	<tr>
		<td colspan='1'> 
		<hr />
		<p>
			<?php 
			echo $myrow[Description]."<br />";
			if($myrow[Height])	{ echo "<br/><strong>H : </strong>".$myrow[Height]."cm&nbsp;"; }
			if($myrow[Width])	{ echo "<strong>W : </strong>".$myrow[Width]."cm&nbsp;"; }
			if($myrow[Length])	{ echo "<strong>L : </strong>".$myrow[Length]."cm&nbsp;"; }
			?>	  
		</p>


		</td>
	</tr>
	
	
</table>			
<script type="text/javascript" >
  ToggleOff();
</script>